<?php
$timeTop=0;
$timeBottom=0;
?>
				<section id="content" class="grid_7 alpha omega">
					<article>
						<h1>Berbagi Informasi</h1>
						<form id="msg" action="<?php echo base_url()?>member.html" class="styled">	
							<textarea class="textbox" name="data[text]" id="text" cols="80%" ></textarea>						
							<input type="submit" value="Bagikan!" class="button" />							
						</form>
						
						<div id="feeds">
							<?php foreach($feed as $rows){
									$row = $rows['feed'];
									$id = $row['id'];
									
									if($timeTop == 0){
										$timeTop = $row['current'];
									}
									
									$timeBottom = $row['current'];
							?>
							<div id="feed-<?php echo $row['id']?>" class="news-feed">
								<div class="feed-gravatar">
									<img src='<?php echo base_url()?>images/profile/<?php echo $row['profile_image']?>' height='50' width='50' />
								</div>
								<div class="feed-data">
									<div class="feed-author"><a href="#" class="url"><?php echo $row['nama_user']?></a></div>				
									<p>
									<?php echo nl2br($row['text'])?>
									</p>
									<?php if($row['url'] != ''){?>
									<div class="feed-url">
										<div class="url-image">
											<?php if($row['image'] != ''){?><img src="<?php echo $row['image']?>" class="avatar-gui" height="55px" width="85px" /><?php } ?>
										</div>
										<div class="url-data">
											<div class="url-title"><a href="<?php echo $row['url']?>" class="url" target="_blank"><?php echo $row['title']?></a></div>				
											<p>
											<?php echo substr($row['description'],0,250)?>
											</p>
										</div>
									</div>
									<?php } ?>
									<div class="feed-meta"><a href="javascript:" onClick="viewMessage(this)">Komentar</a> | <a href="<?php echo base_url()."member/post/$row[id]"?>"><abbr title="<?php echo $row['created']?>"></abbr></a></div>
								</div>
								<?php if($rows['comm']->num_rows() > 0){
										$comm = $rows['comm']->result_array();
								?>
								<ul class="feed-comment">
									<?php if(count($comm) > 5){?><li id="<?php echo  $id?>" class="comment-total"><a href="javascript:" onClick="commentList(this)">Lihat <?php echo (count($comm) - 2)?> Komentar Lain</a></li><?php } ?>
									<?php for($i=(count($comm) > 5?count($comm)-2:0);$i<count($comm);$i++){
										$row = $comm[$i];
									?>
									<li id="comment-<?php echo $row['id']?>" class="comment-detail">
										<div class="comment-gravatar">
											<img src='<?php echo base_url()?>images/profile/<?php echo $row['profile_image']?>' height='32' width='32' />
										</div>
										<div class="comment-data">			
											<p>
												<span class="comment-author"><a href="#" class="url"><?php echo $row['nama_user']?></a></span>
												<?php echo nl2br($row['text'])?>
											</p>
											<?php if($row['url'] != ''){?>
											<div class="comment-url">
												<div class="url-image">
													<?php if($row['image'] != ''){?><img src="<?php echo $row['image']?>" class="avatar-gui" height="55px" width="85px" /><?php } ?>
												</div>
												<div class="url-data">
													<div class="url-title"><a href="<?php echo $row['url']?>" class="url" target="_blank"><?php echo $row['title']?></a></div>				
													<p>
													<?php echo substr($row['description'],0,250)?>
													</p>
												</div>
											</div>
											<?php } ?>
											<div class="comment-meta"><abbr title="<?php echo $row['created']?>"></abbr></div>
										</div>
									</li>
									<?php } ?>
									<li class="comment-form">
										<form id="commentform-<?php echo $id?>"action="" class="styled">
											<input type="hidden" name="data[parent_id]" id="parent_id" value="<?php echo $id?>" /> 
											<textarea class="textbox comm" name="data[text]" id="text" cols="60%" rows="1"></textarea>												
										</form>
									</li>
								</ul>
								<?php } ?>
							</div>
							<?php } ?>
						</div>
					</article>
				</section>
			
				<section id="sidebar" class="right grid_4 alpha omega">
					<h3 class="font-ad">Jadwal Kajian Terdekat</h3>

					<ul class="events">
						<?php

						$data = $kajian['data'];
						//echo '<pre>'.var_dump($data).'</pre>';
						$count=0;
						$break = false;
						for($day=0; $day<=30; $day++){
							$date =  date('Y-m-d',mktime(0, 0, 0, date("m")  , date("d")+$day, date("Y")));
							$dayofweek = date('N',mktime(0, 0, 0, date("m")  , date("d")+$day, date("Y")));
							
							if($break)
								break;
								
							if(isset($data[$dayofweek])){
								foreach($data[$dayofweek] as $row){
									$cek = true;
									
									if($count == 10){
										$break = true;
										break;
									}
									if($row['jns_kajian_id'] != 1 && $row['tanggal_mulai'] != $date)
										$cek = false;
									
									if($cek){
										$count++;
								
						?>
						<li>
							<span class="item-date"><?php echo date('M',strtotime($date))?> <span><?php echo date('d',strtotime($date))?></span></span>
							<h4><a href="<?php echo base_url().'kajian/'.$row['permalink']?>.html"><?php echo $row['judul']?></a></h4>
							<p><em>Tema:</em><?php echo $row['tema']?></p>
							<p><em>Pemateri:</em><?php echo $row['nama_pemateri']?></p>
							<p><em>Waktu:</em><?php echo $row['jam_mulai']?></p>
							<p><em>Tempat:</em><?php echo $row['nama_lokasi'].', '.$row['kota']?></p>
						</li>
						<?php 
									}
								}
							}
						} 
						?>
					</ul>
				</section>
				<section class="cl"></section>
				
<script>
var loadTime='';
var timeTop='<?php echo $timeTop?>';
var timeBottom='<?php echo $timeBottom?>';
			
$(document).ready(function() {
   $("abbr").timeref();
   loadTime = setInterval(function(){ $("abbr").timeref(); loadFeed(true);loadComment();}, 10000);
   
   $('.comm').keyup(function(event){
		if(event.keyCode == 13 && !event.shiftKey) {
			if($(this).val() != ""){
				alert($(this).val()+"sippp");
				var form = $(this).parent();
				//submitComm(form);
			}
		}		
	});
	
	$(window).scroll(function(){
	  if  ($(window).scrollTop() == $(document).height() - $(window).height()){
			loadFeed(false);
	  }
	});

});
  
$("#msg").submit(function(){
	var formInput = $(this).serialize();
	
	$.ajax({
		url: $(this).attr('action'),
		data: formInput,
		beforeSend : function(){
			$.fancybox.showActivity();
		},
		success: function(respon){
			var obj = jQuery.parseJSON(respon);
			if(obj.status == 'success'){
				$("#text").val('');
				var html = getFeed(obj);
				$('#feeds').prepend(html);
				$("abbr").timeref();
				
				timeTop = obj.created;
				
			}else{
				alert('');
			}
			
			$.fancybox.hideActivity();
		},
		type: "POST"
	});
	
	return false;
});

function getFeed(obj){
var html = '<div id="feed-'+obj.id+'" class="news-feed">'
		   +'<div class="feed-gravatar">'
		   +'<img alt="" src="<?php echo base_url()?>images/profile/'+obj.profile_image+'" height="50" width="50" />'
		   +'</div>'
		   +'<div class="feed-data">'
		   +'<div class="feed-author"><a href="#" class="url">'+obj.nama_user+'</a></div>'				
			+'<p>'+obj.text+'</p>';
	
	if(obj.url != ""){
		html = html	+'<div class="feed-url">'
				+'<div class="url-image">';
		if(obj.image != ""){
				html = html	+'<img src="'+obj.image+'" class="avatar avatar-60 photo avatar-gui" height="55px" width="85px" />'
		}		
		html = html	+'</div>'
				+'<div class="url-data">'
				+'<div class="url-title"><a href="'+obj.url+'" class="url" target="_blank">'+obj.title+'</a></div>'			
				+'<p>'+obj.description+'</p>'
				+'</div>'
				+'</div>';
	}
		
	html = html	+'<div class="feed-meta"><a href="javascript:" onClick="viewMessage(this)">Komentar</a> | <a href="<?php echo base_url()?>member/post/'+obj.id+'"><abbr title="'+obj.created+'">1 detik yang lalu</abbr></a></div>'
			+'</div>';
	
	return html;
}

function viewMessage(msg){
	var parent = $(msg).parent().parent().parent();
	var id= parent.attr('id').replace("feed-","");
	var check = true;
	$(parent).children().each(function(){
		var kid = $(this);
		if(kid.attr('class') == 'feed-comment')
			check = false;
	});
	
	if(check){
		var html = '<ul class="feed-comment">'
				+'<li class="comment-form">'
				+'<form id="commentform-'+id+'" action="" class="styled">'
				+'<input type="hidden" name="data[parent_id]" id="parent_id" value="'+id+'" />'
				+'<textarea class="textbox comm" name="data[text]" id="text" cols="60%" rows="1"></textarea>'
				+'</form>'
				+'</li>'
				+'</ul>';
				
		parent.append(html);
		
		$('.comm').keyup(function(event){
			if(event.keyCode == 13 && !event.shiftKey) {
				var form = $(this).parent();
				submitComm(form);
			}		
		});
		$('textarea').autogrow();
	}
	
	$(parent).children('.feed-comment').children('.comment-form').children('form').children('#text').focus();
}

function submitComm(form){
	var formInput = $(form).serialize();
	$.ajax({
		url: $(form).attr('action'),
		data: formInput,
		beforeSend : function(){
			$.fancybox.showActivity();
		},
		success: function(respon){
			var obj = jQuery.parseJSON(respon);
			if(obj.status == 'success'){
				$("#"+$(form).attr('id')+" #text").val('');
				var html = getComm(obj);
				form.parent().parent().children('.comment-form').before(html);
				$("abbr").timeref();
				
			}else{
				alert('');
			}
			
			$.fancybox.hideActivity();
		},
		type: "POST"
	});
}

function getComm(obj){
	var html = '<li id="comment-'+obj.id+'" class="comment-detail">'
		   +'<div class="comment-gravatar">'
		   +'<img src="<?php echo base_url()?>images/profile/'+obj.profile_image+'" height="32" width="32" />'
		   +'</div>'
		   +'<div class="comment-data">'				
		   +'<p><span class="comment-author"><a href="#" class="url">'+obj.nama_user+'</a></span> '+obj.text+'</p>';

	if(obj.url != ""){
		html = html	+'<div class="comment-url">'
				+'<div class="url-image">';
		if(obj.image != ""){
				html = html	+'<img src="'+obj.image+'" class="avatar avatar-60 photo avatar-gui" height="55px" width="85px" />'
		}		
		html = html	+'</div>'
				+'<div class="url-data">'
				+'<div class="url-title"><a href="'+obj.url+'" class="url">'+obj.title+'</a></div>'			
				+'<p>'+obj.description+'</p>'
				+'</div>'
				+'</div>';
	}
		
	html = html	+'<div class="comment-meta"><abbr title="'+obj.created+'"></abbr></div>'
			+'</div>'
			+'</li>';
			
	return html;									
}

function commentList(link){

	var id = $(link).parent().attr('id');
	
	$.ajax({
		url: "<?php echo base_url()?>member/comment.html",
		data: {id:id},
		beforeSend : function(){
			$.fancybox.showActivity();
		},
		success: function(respon){
			$(link).parent().parent().children('.comment-detail').remove();
			var obj = jQuery.parseJSON(respon);
			$.each(obj, function(index, data) {
				$(link).parent().after(getComm(data))
				//console.log(getComm(data));
			})
			
			$("abbr").timeref();
			
			$(link).remove();
			
			$.fancybox.hideActivity();
		},
		type: "POST"
	});
}


function loadFeed(top){
	var time=0;
	if(top)
		time = timeTop;
	else
		time = timeBottom;
	$.ajax({
		url: "<?php echo base_url()?>member/feed.html",
		data: {time:time,top:top},
		beforeSend : function(){
			
		},
		success: function(respon){
			var obj = jQuery.parseJSON(respon);
			
			htmlFeedLoad(obj,top);
		},
		type: "POST"
	});
}

function loadComment(){

	var time = timeTop;
	
	$.ajax({
		url: "<?php echo base_url()?>member/comment.html",
		data: {time:time},
		beforeSend : function(){

		},
		success: function(respon){
			var obj = jQuery.parseJSON(respon);
			$.each(obj, function(index, data) {
				var id = data.parent_id;
				//console.log($("#comment-"+data.id).length);
				if($("#comment-"+data.id).length == 0){
					//console.log("#commentform-"+id);
					$("#commentform-"+id).parent().before(getComm(data));
					timeTop = data.created;
				}
				
			})
			
			$("abbr").timeref();
			
		},
		type: "POST"
	});
}

function htmlFeedLoad(obj,top){
	$.each(obj, function(index, data) {
		if($("#feed-"+data.id).length == 0){
			if(top){
				$('#feeds').prepend(getFeed(data));
				timeTop = data.current;
			}else{
				$('#feeds').append(getFeed(data));
				timeBottom = data.current;
			}
			
			var html = '';
			var check = false;
			
			// $.each(data.comm, function(i, content) {
				// html = html + getComm(content);
				// check = true;
			// })
			
			var i=0;
			if(data.comm.length > 5)
				i = data.comm.length - 2;
				
			for(;i<data.comm.length;i++){
				html = html + getComm(data.comm[i]);
				check = true;
			}
			
			if(check){
				if(data.comm.length > 5){
					html = '<ul class="feed-comment">' 
						+'<li id="'+data.id+'" class="comment-total"><a href="javascript:" onClick="commentList(this)">Lihat '+(data.comm.length - 2)+' Komentar Lain</a></li>'
						+ html;
				}else{
					html = '<ul class="feed-comment">' + html;
				}
				
				html = html + '<li class="comment-form">'
					+'<form id="commentform-'+data.id+'" action="" class="styled">'
					+'<input type="hidden" name="data[parent_id]" id="parent_id" value="'+data.id+'" />'
					+'<textarea class="textbox comm" name="data[text]" id="text" cols="60%" rows="1"></textarea>'
					+'</form>'
					+'</li>'
					+'</ul>'; 
				
				$('#feed-'+data.id).append(html);
			}
			
			$("abbr").timeref();
		}
		//console.log(getComm(data));
	})
}
</script>